/**
 * Created by kevin on 16/8/16.
 */
var eosi = window.eosi || {};
this.eosi.fotile = this.eosi.fotile || {};
//this.eosi.fotile = this.eosi.fotile || {};
//this.eosi.fotile = function(name) {
//    this.name = name;
//};

(function (window) {
    // the application
    function Fotilewait(master) {
        this.Container_constructor();
        this.version = master.version;
        this.init(master);
    }
    var p = createjs.extend(Fotilewait, createjs.Container);

    // public methods:
    p.init = function (master) {
        this.fotile = master;
        console.log("I'm Master wait!!!");
        this.loadFirsrMaster();
    }

    //UI
    p.setupUI = function (){


    }

    //加载wait
    p.loadFirsrMaster = function (){
        var wait = this;
        var qrcode_=new Image();
        // qrcode_.src="http://192.168.0.233:8003/"+qrcode;
        qrcode_.src=qrcode;
        var load=[
            {src:"static/master/wait/bg.jpg",id:"bg"},
            {src:"static/master/wait/bottom_1.png",id:"bottom_1"},
            {src:"static/master/wait/bottom2.png",id:"bottom2"},
            {src:"static/master/wait/phone_left.png",id:"phone_left"},
            {src:"static/master/wait/phone_right.png",id:"phone_right"},
            {src:"static/master/wait/answer.png",id:"answer"},
            {src:"static/master/text/b_1.png",id:"b_1"},
            {src:"static/master/text/b_2.png",id:"b_2"},
            {src:"static/master/text/b_3.png",id:"b_3"},
            {src:"static/master/text/b_4.png",id:"b_4"},];
        Fotileloader = new eosi.fotile.Fotileloader(this.fotile,load,function(){
            wait.setupLoaderUI();
        },1);
        container.addChild(Fotileloader);

        p.setupLoaderUI = function (){
            _this=this;
            var bg = new createjs.Bitmap(this.fotile.master_UILoader.getResult("bg"));
            var answer = new createjs.Bitmap(this.fotile.master_UILoader.getResult("answer"));
            var bottom_1 = new createjs.Bitmap(this.fotile.master_UILoader.getResult("bottom_1"));
            var bottom2 = new createjs.Bitmap(this.fotile.master_UILoader.getResult("bottom2"));
            var b_1 = new createjs.Bitmap(this.fotile.master_UILoader.getResult("b_1"));
            var b_2 = new createjs.Bitmap(this.fotile.master_UILoader.getResult("b_2"));
            var b_3 = new createjs.Bitmap(this.fotile.master_UILoader.getResult("b_3"));
            var b_4 = new createjs.Bitmap(this.fotile.master_UILoader.getResult("b_4"));
            var phone_left = new createjs.Bitmap(this.fotile.master_UILoader.getResult("phone_left"));
            var phone_right=new createjs.Bitmap(this.fotile.master_UILoader.getResult("phone_right"));
            var rqcode=new createjs.Bitmap(qrcode_);

            var v_w = bg.getBounds().width;
            var v_h = bg.getBounds().height;
            var w = this.fotile.getWidth();
            var h = this.fotile.getHeight();
            var ratio_y = h/v_h;
            var ratio_x =  w/v_w;
            bg.setTransform(0,0,ratio_x,ratio_y);
            bg.x=0;
            bg.y=0;

            answer.setTransform(0,0,ratio_x*1.54,ratio_x*1.54);
            answer.x = this.fotile.getWidth()/2-answer.getBounds().width*ratio_x*1.54/2;
            answer.y = this.fotile.getHeight();
            answer.alpha = 1;
            createjs.Tween.get(answer)
                .to({ y: (this.fotile.getHeight()*0.85)-answer.getBounds().height*ratio_x*2,alpha:1}, 1000, createjs.Ease.sineOut);
            bottom_1.setTransform(0,0,ratio_x*1.54,ratio_x*1.54);
            bottom_1.x = this.fotile.getWidth()-bottom_1.getBounds().width*ratio_x*1.54;
            bottom_1.y = (this.fotile.getHeight())-(bottom_1.getBounds().height*ratio_x*1.54);
            bottom_1.alpha = 1;

            bottom2.setTransform(0,0,ratio_x,ratio_x);
            bottom2.x =0;
            bottom2.y = (this.fotile.getHeight()*0.85)-(bottom2.getBounds().height*ratio_x/2);
            bottom2.alpha = 1;

            b_1.setTransform(0,0,ratio_x*1.1,ratio_x*1.1);
            b_1.x = this.fotile.getWidth()/2-b_1.getBounds().width*ratio_x*1.1/2;
            b_1.y = (this.fotile.getHeight()/7)-(b_1.getBounds().height*ratio_x*1.1/2);
            b_1.alpha = 0;
            createjs.Tween.get(b_1)
                .wait(1000)
                .to({alpha:1}, 500, createjs.Ease.linear);
            
            b_2.setTransform(0,0,ratio_x*1.1,ratio_x*1.1);
            b_2.x = this.fotile.getWidth()/2-b_2.getBounds().width*ratio_x*1.1/2;
            b_2.y = (this.fotile.getHeight()/5)-(b_2.getBounds().height*ratio_x*1.1/2);
            b_2.alpha = 0;
            createjs.Tween.get(b_2)
                .wait(2000)
                .to({alpha:1}, 500, createjs.Ease.linear);

            b_3.setTransform(0,0,ratio_x*1.1,ratio_x*1.1);
            b_3.x = this.fotile.getWidth()/2-b_3.getBounds().width*ratio_x*1.1/2;
            b_3.y = (this.fotile.getHeight()/4)-(b_3.getBounds().height*ratio_x*1.1/2);
            b_3.alpha = 0;
            createjs.Tween.get(b_3)
                .wait(3000)
                .to({alpha:1}, 500, createjs.Ease.linear);

            b_4.setTransform(0,0,ratio_x*1.1,ratio_x*1.1);
            b_4.x = this.fotile.getWidth()/2-b_4.getBounds().width*ratio_x*1.1/2;
            b_4.y = (this.fotile.getHeight()/3.2)-(b_4.getBounds().height*ratio_x*1.1/2);
            b_4.alpha = 0;
            createjs.Tween.get(b_4)
                .wait(4000)
                .to({alpha:1}, 500, createjs.Ease.linear);

            phone_left.setTransform(0,0,ratio_x*1.3,ratio_x*1.3);
            phone_left.x = this.fotile.getWidth()*0.2-phone_left.getBounds().width*ratio_x*1.3/2;
            phone_left.y = (this.fotile.getHeight()/4)+(phone_left.getBounds().height/2*ratio_x*1.3)*2;
            // createjs.Tween.get(phone_left,{loop:true})
            //     .to({y:(this.fotile.getHeight()-(phone_left.getBounds().height*ratio_x*1.3))}, 1000, createjs.Ease.linear)
            //     .to({y:(this.fotile.getHeight())-(phone_left.getBounds().height*ratio_x*1.3)*2}, 1000, createjs.Ease.linear);

            phone_right.setTransform(0,0,ratio_x*1.3,ratio_x*1.3);
            phone_right.x = this.fotile.getWidth()*0.8-phone_left.getBounds().width*ratio_x*1.3/2;
            phone_right.y = (this.fotile.getHeight()/4)+(phone_right.getBounds().height/2*ratio_x*1.3)*2;
            // createjs.Tween.get(phone_right,{loop:true})
            //     .to({y:(this.fotile.getHeight()-(phone_right.getBounds().height*ratio_x*1.3))}, 1000, createjs.Ease.linear)
            //     .to({y:(this.fotile.getHeight())-(phone_right.getBounds().height*ratio_x*1.3)*2}, 1000, createjs.Ease.linear);
            rqcode.setTransform(0,0,ratio_x*2.7,ratio_x*2.7);
            rqcode.x = this.fotile.getWidth()/2-rqcode.getBounds().width*ratio_x*2.7/2;
            rqcode.y = (this.fotile.getHeight()/6)+(rqcode.getBounds().height/2*ratio_x*2.7)*2;


            this.addChild(bg);
            this.addChild(answer);
            this.addChild(bottom_1);
            this.addChild(bottom2);
            this.addChild(b_1);
            this.addChild(b_2);
            this.addChild(b_3);
            this.addChild(b_4);
            this.addChild(phone_left);
            this.addChild(phone_right);
            this.addChild(rqcode);
            stage.update();
            // this.clearLoading=function (){
            //     this.removeChild(bg);
            //     this.removeChild(text_box_bg);
            //     this.removeChild(logo);
            //     this.removeChild(a_1);
            //     this.removeChild(a_2);
            //     this.removeChild(a_3);
            //     this.removeChild(a_4);
            //     this.removeChild(a_5);
            //     this.removeChild(a_6);
            //     this.removeChild(bn);
            //     this.removeChild(downarrow);

            //     document.getElementById("canvas").removeEventListener("click",clickPlayBn);
            //     container.removeChild(master);
            //     stage.update();
            // }

        }

    }
    // add MyApp to myNameSpace
    window.eosi.fotile.Fotilewait = createjs.promote(Fotilewait, "Container");
}(window));
